<template>
  <view>
    <hx-navbar ref="hxnb" :config="config">
      <!-- <view slot="bottom">
        <template>
          <view class="input-product">
            <clHeadTab :modelData="modelData" @change="tabChange"></clHeadTab>
          </view>
        </template>
      </view> -->
    </hx-navbar>
    <view > 
      <component :id="id" :is="componentsName"></component>
    </view>
  </view>
</template>

<script>
import clHeadTab from "@/components/cl-head-tab/cl-head-tab.vue";
import clIcon from "@/components/cl-icon/cl-icon.vue";
import info from './info/info.vue'
import other from './other/other.vue'
export default {
  components: {
    clIcon,
    clHeadTab,
    info,
    other
  },
  data() {
    return {
      componentsName:'info',
      search: null,
      modelData: [
        // { label: "信息", name: "info" },
        // { label: "其他", name: "other" },
      ],
      config: {
        title: "员工",
        color: "#ffffff",
        //背景颜色;参数一：透明度（0-1）;参数二：背景颜色（array则为线性渐变，string为单色背景）
        backgroundColor: [1, ["#409EFF", "#409EFF", "#60b4f6", "#60b4f6"]],
      },
      id:null
    };
  },
  computed: {},
  	onLoad() {
			this.id = this.$Route.query.id || null
		},
  methods: {
    tabChange(item) {
      this.componentsName = item.name;
    },
  },
};
</script>

<style lang="scss" scoped>
.input-product {
  width: 95%;
  padding: 0 20upx;
  margin: 30upx auto;
  height: 70upx;
  line-height: 70upx;
  color: #fff;
  display: flex;
}
</style>
